// 主程序
class DisplayController {
    constructor() {
        this.mqttController = new MQTTController();
        this.contentManager = new ContentManager();
        
        this.init();
    }

    // 初始化
    async init() {
        try {
            console.log('正在初始化显示控制器...');
            
            // 设置MQTT消息处理回调
            this.mqttController.onMessage((data) => {
                this.handleMQTTMessage(data);
            });

            // 连接MQTT
            await this.mqttController.connect();

            // 显示默认内容
            this.contentManager.displayContent(CONFIG.defaultContent);

            console.log('显示控制器初始化完成');

        } catch (error) {
            console.error('初始化失败:', error);
        }
    }

    // 处理MQTT消息
    handleMQTTMessage(data) {
        console.log('处理MQTT消息:', data);
        
        try {
            // 显示内容
            this.contentManager.displayContent(data);
            
        } catch (error) {
            console.error('处理消息失败:', error);
        }
    }

    // 测试功能
    testContent() {
        const testMessages = [
            {
                type: 'text',
                content: '欢迎使用远程控制显示系统！',
                title: '欢迎信息',
                duration: 5000
            },
            {
                type: 'image',
                url: 'https://picsum.photos/1920/1080',
                title: '测试图片',
                duration: 8000
            },
            {
                type: 'video',
                url: 'https://sample-videos.com/zip/10/mp4/SampleVideo_1280x720_1mb.mp4',
                title: '测试视频',
                autoplay: true,
                muted: true,
                duration: 15000
            },
            {
                type: 'webpage',
                url: 'https://www.baidu.com',
                title: '百度首页',
                duration: 10000
            }
        ];

        let index = 0;
        const testInterval = setInterval(() => {
            if (index < testMessages.length) {
                this.handleMQTTMessage(testMessages[index]);
                index++;
            } else {
                clearInterval(testInterval);
                this.handleMQTTMessage({ type: 'clear' });
            }
        }, 2000);
    }

    // 全屏切换功能
    toggleFullscreen() {
        if (!document.fullscreenElement) {
            document.documentElement.requestFullscreen().then(() => {
                this.updateFullscreenButton(true);
            }).catch(err => {
                console.error('全屏失败:', err);
            });
        } else {
            document.exitFullscreen().then(() => {
                this.updateFullscreenButton(false);
            }).catch(err => {
                console.error('退出全屏失败:', err);
            });
        }
    }

    // 更新全屏按钮状态
    updateFullscreenButton(isFullscreen) {
        const btn = document.getElementById('fullscreenBtn');
        if (btn) {
            btn.textContent = isFullscreen ? '退出全屏' : '全屏';
        }
    }
}

// 页面加载完成后初始化
document.addEventListener('DOMContentLoaded', () => {
    window.displayController = new DisplayController();
    
    // 添加键盘快捷键
    document.addEventListener('keydown', (event) => {
        // Ctrl+T: 测试内容
        if (event.ctrlKey && event.key === 't') {
            event.preventDefault();
            console.log('开始测试内容...');
            window.displayController.testContent();
        }
        
        // Ctrl+C: 清除内容
        if (event.ctrlKey && event.key === 'c') {
            event.preventDefault();
            console.log('清除内容...');
            window.displayController.handleMQTTMessage({ type: 'clear' });
        }
        
        // F11: 全屏切换
        if (event.key === 'F11') {
            event.preventDefault();
            window.displayController.toggleFullscreen();
        }
    });

    // 监听全屏状态变化
    document.addEventListener('fullscreenchange', () => {
        if (window.displayController) {
            window.displayController.updateFullscreenButton(!!document.fullscreenElement);
        }
    });

    // 添加右键菜单
    document.addEventListener('contextmenu', (event) => {
        event.preventDefault();
        
        const menu = document.createElement('div');
        menu.style.cssText = `
            position: fixed;
            top: ${event.clientY}px;
            left: ${event.clientX}px;
            background: rgba(0, 0, 0, 0.9);
            color: white;
            padding: 10px;
            border-radius: 5px;
            z-index: 10000;
            font-size: 14px;
        `;
        
        menu.innerHTML = `
            <div style="cursor: pointer; padding: 5px;" onclick="window.displayController.testContent()">测试内容</div>
            <div style="cursor: pointer; padding: 5px;" onclick="window.displayController.handleMQTTMessage({type: 'clear'})">清除内容</div>
            <div style="cursor: pointer; padding: 5px;" onclick="document.documentElement.requestFullscreen()">全屏显示</div>
        `;
        
        document.body.appendChild(menu);
        
        setTimeout(() => {
            document.body.removeChild(menu);
        }, 3000);
    });
});

// 全局全屏切换函数
window.toggleFullscreen = function() {
    if (window.displayController) {
        window.displayController.toggleFullscreen();
    }
};

// 页面卸载时清理资源
window.addEventListener('beforeunload', () => {
    if (window.displayController && window.displayController.mqttController) {
        window.displayController.mqttController.disconnect();
    }
}); 